<template>
  <div>
    <div>
    <input v-model="inputValue" type="text" name="">
    <button @click='handleSub'>提交</button>
  </div>
  <ul>
    <todo-item v-for='(n,i) of list' :key='i' :content='n' :index='i'
    @delete='delete2'></todo-item>
  </ul>
  </div>
</template>

<script>
  import TodoItem from './components/TodoItem'
export default {
  components:{
    'todo-item' :TodoItem
  },
  data(){
    return {
      inputValue:''
      ,list:[]
    }
  },
  methods:{
    handleSub(){
      this.list.push(this.inputValue)
      this.inputValue=''
    }
    ,delete2(i){
      this.list.splice(i,1)
    }
  }
}
</script>

<style>

</style>
